
.project{
    margin-top: 10px;
}
.project-star{
    margin-top: 8px;
}
.panel-body{
    padding: 0;
    display: flex;
    flex-direction: row;
    justify-content: left;
    align-items: flex-start;
    flex-wrap: wrap;
}
.panel-body > .item{
    border-radius: 6px;
    width: 220px;
    border: 1px solid #dddddd;
    margin: 20px 10px;
}
.panel-body > .item > .title{
    height: 104px;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    font-size: 15px;
    text-decoration: none;
}
.panel-body > .item > .info{
    padding: 10px 10px;
    display: flex;
    justify-content: space-between;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    color: #8c8c8c;
}
.panel-body > .item >.info a {
    text-decoration: none;
}
.panel-body > .item >.info .fa-star {
    font-size: 18px;
}

/* 显示圆点颜色的样式
    1 设置标签color-radio的整体边距
    2 设置标签color-radio下面的input输入框的显示属性为none，即为隐藏状态
    3 设置标签color-radio下面的input输入框，跟它同级别的标签cycle的属性，其中+号代表同级
*/
.color-radio label{
    margin-left: 0;
    padding-left: 0;
}
.color-radio input[type="radio"]{

    display: none;
}
.color-radio input[type="radio"] + .cycle{
    display: inline-block;
    height: 25px;
    width: 25px;
    border-radius: 50%; /* 设置为圆角，即变为圆形*/
    border: 2px solid #dddddd; /* 圆角的边框为2像素，solid设置边框的颜色*/
}
/* 设置这个输入框在选中状态时，边框的粗细和颜色*/
.color-radio input[type="radio"]:checked + .cycle{
    border: 2px solid black;
}














